<style>
    .layui-fluid {
        padding: 0 10px 0 20px;
    }

    .share1 > div {
        width: 100%;
    }

    .share2 > div {
        width: calc((100% - 20px) / 2);
    }

    .share3 > div {
        width: calc((100% - 40px) / 3);
    }

    .share4 > div {
        width: calc((100% - 60px) / 4);
    }

    .share5 > div {
        width: calc((100% - 80px) / 5);
    }

    .share6 > div {
        width: calc((100% - 100px) / 6);
    }

    .inventoryReportMainBox {
        width: calc(100% - 3px);
        height: 100%;
        overflow-y: scroll;
        overflow-x: hidden;
        padding-right: 5px;

    }

    /*头部导航栏*/
    .report-nav-box {
        width: 100%;
        background: #FFFFFF;
        border-radius: 5px 5px 5px 5px;
        height: 61px;
        position: relative;
        margin-bottom: 20px;
        z-index: 9;
        box-shadow: 0 20px 0 0 #F0F2F5;
    }

    .report-nav {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
    }


    .report-nav .report-nav-item {
        padding: 10px;
        margin: 0 35px;
        font-size: 16px;
        font-family: Microsoft YaHei-Regular, Microsoft YaHei;
        font-weight: 400;
        color: #999999;
        -webkit-background-clip: text;
        cursor: pointer;
        transition: all 300ms;
    }

    .report-nav .report-nav-item.active,
    .report-nav .report-nav-item:hover {
        font-family: Microsoft YaHei-Bold, Microsoft YaHei;
        font-weight: bold;
        color: #333333;
    }

    /*tab选项卡*/
    .report-tab {
        width: 100%;
        border-bottom: 2px solid #009C5E;
        margin-bottom: 20px;
        box-shadow: 0 28px 0 0 #F0F2F5;
        position: relative;
        z-index: 9;
    }

    .report-tab-box {
        height: 51px;
        display: flex;
        background-color: #F0F2F5;
    }

    .report-tab-list {
        border-top: 1px solid #009C5E;
        border-left: 1px solid #009C5E;
        border-right: 1px solid #009C5E;
        padding: 12px 35px;
        margin-right: 10px;
        font-size: 20px;
        font-family: Microsoft YaHei-Regular, Microsoft YaHei;
        font-weight: 400;
        color: #333333;
        line-height: 23px;
        background-color: #ffffff;
        border-radius: 2px 2px 0 0;
        cursor: pointer;
        transition: all 0.3s;
    }

    .report-tab-list.active,
    .report-tab-list:hover {
        background: #009C5E;
        color: #FFFFFF;
        font-weight: bold;
    }

    .report-nav-bar {
        width: 0;
        height: 6px;
        background: #009C5E;
        position: absolute;
        left: -100px;
        bottom: 0;
        transition: all 500ms;
        transform: translateX(-50%);
    }

    /*报表区域*/
    .report {
        width: 100%;
        /*height: calc(100% - 81px);*/
        /*overflow: hidden;*/
    }

    .report-body {
        width: 100%;
    }

    .report-bodyList {
        display: none;
    }

    .report-bodyList.active {
        display: block;
    }

    .report-body-list {
        display: none;
    }

    .report-body-list:first-child {
        display: block;
    }

    .report-main {
        width: 100%;
    }

    .report-main .layui-input {
        background-color: #F5F6FA;
        border-color: transparent;
    }

    .report-main .layui-form-select .layui-edge {
        border-top-color: #00C573;
    }

    .report-main-box {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .report-main-item {
        flex: 1;
        background-color: #ffffff;
        height: 460px;
        margin-right: 20px;
        margin-bottom: 20px;
        padding: 10px;
        transition: all 1000ms;
        box-sizing: border-box;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }

    .report-main-box > div:last-child {
        margin-right: 0;
    }

    .report-main-item .report-item-header {
        display: flex;
        justify-content: space-between;
        height: 38px;
        align-items: center;
        margin-bottom: 10px;
    }

    .report-item-header .report-item-headerTitle {
        font-size: 20px;
        font-weight: bold;
        color: #333333;
        line-height: 23px;
        margin-right: auto;
    }

    .report-item-header .report-item-headerTips {
        display: flex;
        margin-right: auto;
        margin-left: auto;
    }

    .report-item-headerTips > div {
        display: flex;
        min-width: 200px;
        max-width: 300px;
        width: auto;
        overflow: hidden;
        align-items: center;
        margin-left: 7px;
        margin-right: 7px;
        height: 42px;
        box-sizing: border-box;
        border-radius: 4px 4px 4px 4px;
        border: 1px solid #9AAEBB;
        padding: 0 10px;
    }

    .reportItemTips1 > img, .reportItemTips2 > img {
        width: 22px;
        height: 22px;
        margin-right: 10px;
    }

    .reportItemTips1 > p, .reportItemTips2 > p {
        font-size: 14px;
        font-family: Microsoft YaHei-Regular, Microsoft YaHei;
        font-weight: 400;
        color: #333333;
    }

    .reportItemTips1 > p span, .reportItemTips2 > p span {
        color: #000000;
        font-weight: 600;
    }

    .report-item-header .report-item-headerSelect {
        width: 110px;
        background: #F5F6FA;
        border-radius: 5px 5px 5px 5px;
        box-sizing: border-box;
        margin-right: 15px;
    }

    .report-item-header .report-item-headerSwitch {
        width: 106px;
        height: 24px;
        background: #9AAEBB;
        border-radius: 16px 16px 16px 16px;
        box-sizing: border-box;
        padding: 2px;
        display: flex;
        margin-right: 15px;
    }

    .report-item-headerSwitch .report-item-headerSwitchItem {
        width: 51px;
        height: 20px;
        font-size: 12px;
        font-weight: 400;
        color: #fff;
        text-align: center;
        line-height: 20px;
        background-color: transparent;
        border-radius: 10px;
        cursor: pointer;
        transition: all 300ms;
    }

    .report-item-headerSwitch .report-item-headerSwitchItem.active {
        background-color: #fff;
        color: #9AAEBB;
    }

    .report-item-more {
        margin-left: 30px;
        font-size: 16px;
        font-weight: 400;
        color: #666666;
        cursor: pointer;
    }

    .report-main-item .report-item-box {
        flex: 1;
        overflow-y: scroll;
        overflow-x: hidden;
    }

    .report-item-box .report-itemEcharts {
        width: 100%;
        height: 100%;
    }

    .report-timeSelect {
        display: flex;
        box-sizing: border-box;
        justify-content: space-between;
        align-items: center;
        padding-bottom: 10px;
        z-index: 9999;
        background-color: #F0F2F5;
        position: relative;
    }

    .report-timeSelect .report-timeSelect-title {
        height: 26px;
        font-size: 20px;
        font-weight: bold;
        color: #333333;
        line-height: 23px;
        position: relative;
        padding: 0 16px;
    }

    .report-timeSelect-title:before {
        content: "";
        display: block;
        height: 100%;
        width: 6px;
        background: #009C5E;
        position: absolute;
        left: 0;
        top: 0;
    }

    .report-timeSelect .report-timeSelect-box {
        display: flex;
    }

    .report-timeSelect-box > div {
        width: 110px;
        height: 48px;
        background: #FFFFFF;
        border-radius: 5px 5px 5px 5px;
        box-sizing: border-box;
        padding: 5px 10px;
        border: 1px solid #EDEFF4;
        margin-left: 10px;
    }

    .report-timeSelect-box .timeFreedom {
        box-sizing: border-box;
        width: 230px;
        height: 48px;
        background: #FFFFFF;
        border-radius: 5px 5px 5px 5px;
        border: 1px solid #EDEFF4;
        padding: 5px 10px;
        line-height: 38px;
        display: flex;
    }

    .timeFreedom .layui-icon {
        font-size: 30px;
    }

    .timeFreedom input {
        width: calc(100% - 30px);
        display: inline-block;
    }

    .report-timeSelect-box > div input {
        border-width: 0;
        font-size: 16px;
        font-weight: 400;
        color: #333333;
        line-height: 19px;
    }

    .report-card {
        display: flex;
        justify-content: space-between;
        margin-bottom: 20px;
    }

    .report-card > .statBoxItemList {
        box-sizing: border-box;
        padding: 18px 20px;
        height: 132px;
        background: #FFFFFF;
        border-radius: 5px 5px 5px 5px;
        display: flex;
        cursor: pointer;
        transition: all 300ms;
        align-items: center;
    }

    .statBoxItemList > .statBoxItemListContent {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
    }

    .statBoxItemListContent .statBoxItemListName {
        font-size: 12px;
        font-weight: 400;
        color: #999999;
        line-height: 14px;
        margin-bottom: 10px;
        white-space: nowrap;
    }

    .statBoxItemListContent .statBoxItemListNum {
        font-size: 36px;
        font-weight: bold;
        color: #333333;
        line-height: 42px;
    }

    .statBoxItemListSub {
        display: flex;
        flex: 2;
        margin-left: 20px;
        flex-direction: column;
        justify-content: space-between;
        padding-left: 20px;
        border-left: 1px solid #ECECEC;
        margin-right: 10px;
    }

    .statBoxItemListSub .statBoxItemListSubBox:first-child {
        margin-bottom: 15px;
    }

    .statBoxItemListSub .statBoxItemListSubBox .statBoxItemListName1,
    .statBoxItemListSub .statBoxItemListSubBox .statBoxItemListName2 {
        height: 16px;
        font-size: 12px;
        font-weight: 400;
        color: #999999;
        line-height: 14px;
    }

    .statBoxItemListSub .statBoxItemListSubBox .statBoxItemListNum1,
    .statBoxItemListSub .statBoxItemListSubBox .statBoxItemListNum2 {
        height: 21px;
        font-size: 16px;
        font-weight: bold;
        color: #333333;
        line-height: 19px;
    }

    .statBoxItemListImg {
        width: 70px;
        height: 70px;
        margin-top: 3px;
    }

    .report-table {
        width: 100%;
        min-height: 450px;
        background-color: #FFFFFF;
        overflow: hidden;
        padding: 20px;
        box-sizing: border-box;
    }

    .report-table-title {
        height: 26px;
        font-size: 20px;
        font-weight: bold;
        color: #333333;
        line-height: 23px;
    }

    .report-itemEcharts > div:last-child {
        white-space: normal !important;
        word-break: break-word;
        max-width: 45%;
    }

    /*.report-main-item:has(.reportItemCenter){*/
    /*    padding:10px 0 10px 10px;*/
    /*}*/
    .reportItemCenter {
        width: 100%;
        height: auto;
        box-sizing: border-box;
        padding-right: 10px;
    }

    .listBox1 > .listItem1 {
        display: flex;
        align-items: center;
        margin-top: 18px;
    }

    .listItem1 .listItem1Index {
        width: 26px;
        height: 26px;
        background: #F1F2F6;
        border-radius: 50%;
        line-height: 26px;
        text-align: center;
        margin-right: 10px;
        font-size: 14px;
        font-family: Microsoft YaHei-Regular, Microsoft YaHei;
        font-weight: 400;
        color: #666666;
    }

    .listItem1 .listItem1Content {
        flex: 1;
    }

    .listItem1Top {
        display: flex;
        align-items: center;
    }

    .listItem1Name {
        flex: 1;
        font-size: 12px;
        font-family: Roboto-Regular, Roboto;
        font-weight: 400;
        color: #333333;
    }

    .listItem1Value {
        min-width: 60px;
        max-width: 200px;
        margin-right: 10px;
        font-size: 14px;
        font-family: Roboto-Medium, Roboto;
        font-weight: 500;
        color: #333333;
        overflow: hidden;
    }

    .listItem1Ratio {
        font-size: 14px;
        font-family: Roboto-Medium, Roboto;
        font-weight: 500;
        color: #2CBB79;
    }

    .listBox1 .listItem1:first-child .listItem1Ratio {
        color: #FFB94D;
    }

    .listItem1ProgressBox {
        margin-top: 5px;
        width: 100%;
        overflow: hidden;
        height: 16px;
        background: #EDEFF2;
        border-radius: 102px 102px 102px 102px;
    }

    .listItem1ProgressBar {
        height: 16px;
        background: #2CBB79;
        border-radius: 102px 102px 102px 102px;
    }

    .listBox1 .listItem1:first-child .listItem1ProgressBar {
        background: #FFB94D;
    }
</style>
<div class="layui-fluid">
    <div class="inventoryReportMainBox" id="inventoryReportMainBox">
        <!-- 标题 主柜、时间选择   -->
        <div class="report-timeSelect" id="timeSelect">
            <div class="report-timeSelect-title">物料数据统计</div>
            <div class="report-timeSelect-box layui-form" lay-filter="reportTimeSelectBox">
                <div class="selectBox" style="width: 230px;" id="mainCabCodeBox">
                    <select name="mainCabCode" lay-filter="mainCabCode"></select>
                </div>
                <div class="timeFreedom">
                    <i class="layui-icon layui-icon-date" id="dayIcon"></i>
                    <input type="text" class="layui-input" readonly="true" id="day" placeholder="请选择时间">
                </div>
            </div>
        </div>
        <!-- 头部报表   -->
        <div class="report-main" id="reportTop">
            <div class="report-main-box share1">
                <div class="report-main-item layui-form" id="inventoryReportDay" style="height: 429px">
                    <div class="report-item-header">
                        <div class="report-item-headerTitle">新物料统计</div>
                        <div class="report-item-headerTips">
                            <div class="reportItemTips1">
                                <img src="assets/images/workshopReportImg/icon2.png">
                                <p>新物料库存总数：<span>0</span></p>
                            </div>
                            <div class="reportItemTips2">
                                <img src="assets/images/workshopReportImg/icon1.png">
                                <p>新物料库存总金额：<span>0</span></p>
                            </div>
                        </div>
                        <div class="report-item-headerSelect" style="width: 120px">
                            <select name="selectParam" lay-filter="selectParamTop">
                                <option value="spu">按系列(SPU)</option>
                                <option value="sku">按系列(SKU)</option>
                                <option value="type">按类型</option>
                                <option value="category">按分类</option>
                                <option value="brand">按品牌</option>
                            </select>
                        </div>
                        <div class="report-item-headerSwitch">
                            <div class="report-item-headerSwitchItem active">按数量</div>
                            <div class="report-item-headerSwitchItem">按金额</div>
                        </div>
                        <div class="report-item-more">
                            更多<i class="layui-icon layui-icon-right"></i>
                        </div>
                    </div>
                    <div class="report-item-box">
                        <div class="report-itemEcharts"></div>
                    </div>
                </div>
            </div>
        </div>

        <!--tab选项(售刀柜、存刀柜)-->
        <div class="report-tab" id="reportTab">
            <div class="report-tab-box" id="reportTabBox">
                <div class="report-tab-list active" name="selling">售刀柜</div>
                <div class="report-tab-list" name="storage">存刀柜</div>
            </div>
        </div>

        <!--    导航栏-->
        <div class="report-nav-box" id="reportNavBox">
            <div class="report-nav active" id="reportNav">
                <!--<div class="report-nav-item active" name='overview'>总览</div>
                <div class="report-nav-item" name='material'>按物料</div>
                <div class="report-nav-item" name='cabinet'>按柜子</div>-->
            </div>
            <div class="report-nav-bar" id="reportNavBar"></div>
        </div>

        <div class="report" id="report">
            <!--    卡片统计-->
            <div class="" id="overviewCard">
                <div class="report-card share3">
                    <div class="statBoxItemList" sign="1">
                        <div class="statBoxItemListContent">
                            <p class="statBoxItemListName">售刀柜库存数量（基础单位）</p>
                            <p class="statBoxItemListNum">0</p>
                        </div>
                        <div class="statBoxItemListImg">
                            <img src="assets/images/20230913-report/drawer.png">
                        </div>
                    </div>
                    <div class="statBoxItemList" sign="1">
                        <div class="statBoxItemListContent">
                            <p class="statBoxItemListName">售刀柜在库总金额（元）</p>
                            <p class="statBoxItemListNum">0.00</p>
                        </div>
                        <div class="statBoxItemListImg">
                            <img src="assets/images/20230913-report/money.png">
                        </div>
                    </div>
                    <div class="statBoxItemList" sign="1">
                        <div class="statBoxItemListContent">
                            <p class="statBoxItemListName">售刀柜库存告警数（条）</p>
                            <p class="statBoxItemListNum">0</p>
                        </div>
                        <div class="statBoxItemListImg">
                            <img src="assets/images/20230913-report/warn.png">
                        </div>
                    </div>
                </div>
                <div class="report-card share3">
                    <div class="statBoxItemList" sign="1">
                        <div class="statBoxItemListContent">
                            <p class="statBoxItemListName">暂存刀具数量</p>
                            <p class="statBoxItemListNum">0</p>
                        </div>
                        <div class="statBoxItemListSub">
                            <div class="statBoxItemListSubBox">
                                <p class="statBoxItemListName1">暂存刀具数量（公共）</p>
                                <p class="statBoxItemListNum1">0</p>
                            </div>
                            <div class="statBoxItemListSubBox">
                                <p class="statBoxItemListName2">暂存刀具数量（专人）</p>
                                <p class="statBoxItemListNum2">0</p>
                            </div>
                        </div>
                        <div class="statBoxItemListImg">
                            <img src="assets/images/20230913-report/drawer.png">
                        </div>
                    </div>
                    <div class="statBoxItemList" sign="1">
                        <div class="statBoxItemListContent">
                            <p class="statBoxItemListName">报修数量（待盘验）</p>
                            <p class="statBoxItemListNum">0.00</p>
                        </div>
                        <div class="statBoxItemListImg">
                            <img src="assets/images/20230913-report/user.png">
                        </div>
                    </div>
                    <div class="statBoxItemList" sign="1">
                        <div class="statBoxItemListContent">
                            <p class="statBoxItemListName">报废数量（待盘验）</p>
                            <p class="statBoxItemListNum">0</p>
                        </div>
                        <div class="statBoxItemListImg">
                            <img src="assets/images/20230913-report/drawer.png">
                        </div>
                    </div>
                </div>
            </div>
            <!--    报表区域-->
            <div class="report-body" id="reportBody">
                <!--售刀柜 selling-->
                <div class="report-bodyList active" data-name="selling">
                    <div class="report-body-list active" id="sellingOverview">
                        <div class="report-main">
                            <div class="report-main-box share2">
                                <div class="report-main-item layui-form" id="selling_materialRankingByLibrary">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按物料）</div>
                                        <div class="report-item-headerSelect" style="width: 120px">
                                            <select name="selectParam" lay-filter="lingxinByMaterialType">
                                                <option value="spu">按系列(SPU)</option>
                                                <option value="sku">按系列(SKU)</option>
                                                <option value="type">按类型</option>
                                                <option value="category">按分类</option>
                                                <option value="brand">按品牌</option>
                                            </select>
                                        </div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                                <div class="report-main-item layui-form" id="selling_materialRankingByCabinet">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按柜子）</div>
                                        <div class="report-item-headerSelect" style="width: 100px">
                                            <select name="selectParam" lay-filter="lingxinByCabinetType">
                                                <option value="main">按主柜</option>
                                                <option value="desk">按副柜</option>
                                            </select>
                                        </div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="report-body-list" id="sellingMaterial">
                        <div class="report-main">
                            <div class="report-main-box share1">
                                <div class="report-main-item layui-form" id="selling_materialRankingBySPU">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按系列SPU）</div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="report-main-box share2">
                                <div class="report-main-item layui-form" id="selling_materialRankingBySKU"
                                     style="height: 1420px">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按SKU）</div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="reportItemCenter">
                                            <div class="listBox1">
                                                <!--<div class="listItem1">
                                                    <div class="listItem1Index">1</div>
                                                    <div class="listItem1Content">
                                                        <div class="listItem1Top">
                                                            <div class="listItem1Name">工单编号01</div>
                                                            <div class="listItem1Value">1000</div>
                                                            <div class="listItem1Ratio">80%</div>
                                                        </div>
                                                        <div class="listItem1ProgressBox">
                                                            <div class="listItem1ProgressBar" style="width: 80%"></div>
                                                        </div>
                                                    </div>
                                                </div>-->
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="share1">
                                    <div class="report-main-item layui-form" id="selling_materialRankingByType">
                                        <div class="report-item-header">
                                            <div class="report-item-headerTitle">物料在库排名（按类型）</div>
                                            <div class="report-item-headerSwitch">
                                                <div class="report-item-headerSwitchItem active">按数量</div>
                                                <div class="report-item-headerSwitchItem">按金额</div>
                                            </div>
                                            <div class="report-item-more">
                                                更多<i class="layui-icon layui-icon-right"></i>
                                            </div>
                                        </div>
                                        <div class="report-item-box">
                                            <div class="report-itemEcharts"></div>
                                        </div>
                                    </div>
                                    <div class="report-main-item layui-form"
                                         id="selling_materialRankingByClassification">
                                        <div class="report-item-header">
                                            <div class="report-item-headerTitle">物料在库排名（按分类）</div>
                                            <div class="report-item-headerSwitch">
                                                <div class="report-item-headerSwitchItem active">按数量</div>
                                                <div class="report-item-headerSwitchItem">按金额</div>
                                            </div>
                                            <div class="report-item-more">
                                                更多<i class="layui-icon layui-icon-right"></i>
                                            </div>
                                        </div>
                                        <div class="report-item-box">
                                            <div class="report-itemEcharts"></div>
                                        </div>
                                    </div>
                                    <div class="report-main-item layui-form" id="selling_materialRankingByBrand">
                                        <div class="report-item-header">
                                            <div class="report-item-headerTitle">物料在库排名（品牌）</div>
                                            <div class="report-item-headerSwitch">
                                                <div class="report-item-headerSwitchItem active">按数量</div>
                                                <div class="report-item-headerSwitchItem">按金额</div>
                                            </div>
                                            <div class="report-item-more">
                                                更多<i class="layui-icon layui-icon-right"></i>
                                            </div>
                                        </div>
                                        <div class="report-item-box">
                                            <div class="report-itemEcharts"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="report-body-list" id="sellingCabinet">
                        <div class="report-main">
                            <div class="report-main-box share2">
                                <div class="report-main-item layui-form" id="selling_materialRankingByMainCabinet">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按主柜）</div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                                <div class="report-main-item layui-form" id="selling_materialRankingByAuxiliaryCabinet">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按副柜）</div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="report-main-box share1">
                                <div class="report-main-item layui-form" id="selling_materialRankingByCargoLanes">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库统计（按货道）</div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!--存刀柜 storage-->
                <div class="report-bodyList" data-name="storage">
                    <div class="report-body-list active" id="storageOverview">
                        <div class="report-main">
                            <div class="report-main-box share2">
                                <div class="report-main-item layui-form" id="storage_materialRankingByLibrary">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按物料）</div>
                                        <div class="report-item-headerSelect" style="width: 120px">
                                            <select name="selectParam" lay-filter="lingxinByMaterialType">
                                                <option value="spu">按系列(SPU)</option>
                                                <option value="sku">按系列(SKU)</option>
                                                <option value="type">按类型</option>
                                                <option value="category">按分类</option>
                                                <option value="brand">按品牌</option>
                                            </select>
                                        </div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                                <div class="report-main-item layui-form" id="storage_materialRankingByCabinet">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按柜子）</div>
                                        <div class="report-item-headerSelect" style="width: 100px">
                                            <select name="selectParam" lay-filter="lingxinByCabinetType">
                                                <option value="main">按主柜</option>
                                                <option value="desk">按副柜</option>
                                            </select>
                                        </div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="report-main-box share1">
                                <div class="report-main-item layui-form" id="storage_materialRankingByDepositor">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按存入人）</div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="report-body-list" id="storageMaterial">
                        <div class="report-main">
                            <div class="report-main-box share1">
                                <div class="report-main-item layui-form" id="storage_materialRankingBySPU">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按系列SPU）</div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="report-main-box share2">
                                <div class="report-main-item layui-form" id="storage_materialRankingBySKU"
                                     style="height: 1420px">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按SKU）</div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="reportItemCenter">
                                            <div class="listBox1">
                                                <!--<div class="listItem1">
                                                    <div class="listItem1Index">1</div>
                                                    <div class="listItem1Content">
                                                        <div class="listItem1Top">
                                                            <div class="listItem1Name">工单编号01</div>
                                                            <div class="listItem1Value">1000</div>
                                                            <div class="listItem1Ratio">80%</div>
                                                        </div>
                                                        <div class="listItem1ProgressBox">
                                                            <div class="listItem1ProgressBar" style="width: 80%"></div>
                                                        </div>
                                                    </div>
                                                </div>-->
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="share1">
                                    <div class="report-main-item layui-form" id="storage_materialRankingByType">
                                        <div class="report-item-header">
                                            <div class="report-item-headerTitle">物料在库排名（按类型）</div>
                                            <div class="report-item-headerSwitch">
                                                <div class="report-item-headerSwitchItem active">按数量</div>
                                                <div class="report-item-headerSwitchItem">按金额</div>
                                            </div>
                                            <div class="report-item-more">
                                                更多<i class="layui-icon layui-icon-right"></i>
                                            </div>
                                        </div>
                                        <div class="report-item-box">
                                            <div class="report-itemEcharts"></div>
                                        </div>
                                    </div>
                                    <div class="report-main-item layui-form"
                                         id="storage_materialRankingByClassification">
                                        <div class="report-item-header">
                                            <div class="report-item-headerTitle">物料在库排名（按分类）</div>
                                            <div class="report-item-headerSwitch">
                                                <div class="report-item-headerSwitchItem active">按数量</div>
                                                <div class="report-item-headerSwitchItem">按金额</div>
                                            </div>
                                            <div class="report-item-more">
                                                更多<i class="layui-icon layui-icon-right"></i>
                                            </div>
                                        </div>
                                        <div class="report-item-box">
                                            <div class="report-itemEcharts"></div>
                                        </div>
                                    </div>
                                    <div class="report-main-item layui-form" id="storage_materialRankingByBrand">
                                        <div class="report-item-header">
                                            <div class="report-item-headerTitle">物料在库排名（按品牌）</div>
                                            <div class="report-item-headerSwitch">
                                                <div class="report-item-headerSwitchItem active">按数量</div>
                                                <div class="report-item-headerSwitchItem">按金额</div>
                                            </div>
                                            <div class="report-item-more">
                                                更多<i class="layui-icon layui-icon-right"></i>
                                            </div>
                                        </div>
                                        <div class="report-item-box">
                                            <div class="report-itemEcharts"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="report-body-list" id="storageCabinet">
                        <div class="report-main">
                            <div class="report-main-box share2">
                                <div class="report-main-item layui-form" id="storage_materialRankingByMainCabinet">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按主柜）</div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                                <div class="report-main-item layui-form" id="storage_materialRankingByAuxiliaryCabinet">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按副柜）</div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="report-main-box share1">
                                <div class="report-main-item layui-form" id="storage_materialRankingByCargoLanes">
                                    <div class="report-item-header">
                                        <div class="report-item-headerTitle">物料在库排名（按库位）</div>
                                        <div class="report-item-headerSwitch">
                                            <div class="report-item-headerSwitchItem active">按数量</div>
                                            <div class="report-item-headerSwitchItem">按金额</div>
                                        </div>
                                        <div class="report-item-more">
                                            更多<i class="layui-icon layui-icon-right"></i>
                                        </div>
                                    </div>
                                    <div class="report-item-box">
                                        <div class="report-itemEcharts"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!--卡片弹窗-->
<script type="text/html" id="cardTemplate">
    <form lay-filter="cardTemplateForm" class="layui-form model-form"
          style="padding: 0 15px 10px;height: calc(100% - 20px);overflow: hidden;">
        <div class="open-details-box" style="height: calc(100% - 45px); overflow-y: scroll">
            <div>
                <table class="layui-table" id="cardTemplateTable" lay-filter="cardTemplateTable"></table>
            </div>
        </div>
        <div class="layui-form-item text-right">
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
            <button type="button" class="layui-btn" id="cardTemplateExport">导出数据</button>
        </div>
    </form>
</script>

<!--数据图表弹窗-->
<script type="text/html" id="allDataChart">
    <form lay-filter="allDataChartForm" class="layui-form model-form"
          style="padding: 10px 15px;height: calc(100% - 20px);overflow: hidden;">
        <div class="open-details-box" style="height: calc(100% - 45px); overflow-y: scroll">
            <div class="layui-row table-bor" style="height: calc(100% - 10px);" id="allDataChartFormchartDom"></div>
            <div style="display: none" id="allDataChartTableBox">
                <table class="layui-table" id="allDataChartTable" lay-filter="allDataChartTable"
                       style="display: none"></table>
            </div>
        </div>
        <div class="layui-form-item text-right">
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
            <button type="button" class="layui-btn" id="allDataChartFormExport">导出数据</button>
        </div>
    </form>
</script>

<!--listBox1模板-->
<script id="listBox1" type="text/html">
    {{#
    var isNullObj = function (_data) {
    if (_data) {
    if (JSON.stringify(_data) == "{}") { return '0%' } else { return _data }
    }
    return '0%';
    }
    }}

    {{#
    var eleWidth = function(_value,_oneValue){
    return "width:"+(_value/(_oneValue>0?_oneValue:1))*100+"%"
    }
    }}

    {{#  layui.each(d, function(index, item){ }}
    <div class="listItem1">
        <div class="listItem1Index">{{ index+1 }}</div>
        <div class="listItem1Content">
            <div class="listItem1Top">
                <div class="listItem1Name">{{ item.name }}</div>
                <div class="listItem1Value">{{ item.value }}</div>
                <div class="listItem1Ratio">{{ isNullObj(item.ratio) }}</div>
            </div>
            <div class="listItem1ProgressBox">
                <div class="listItem1ProgressBar" style="{{ eleWidth(item.value, d[0].value) }}"></div>
            </div>
        </div>
    </div>
    {{#  }); }}
    {{#  if(d.length === 0){ }}
    <h2 style="text-align: center;line-height: 100px">暂无内容~~~</h2>
    {{#  } }}


</script>

<!-- js部分 -->
<script src="/admin/assets/libs/echarts/echarts.min.js"></script>
<script src="/admin/assets/libs/echarts/echartsTheme.js"></script>

<script>
    layui.use(['layer', 'element', 'config', 'admin', 'form', 'table', 'laydate'], function () {
        let $ = layui.jquery;
        let {layer, element, config, table, admin, form, laydate, laytpl} = layui;

        //页面配置信息
        let reportTop = {
                id: 'inventoryReportDay',
                url: 'enterprisecab/bill/admin/inventoryReport/list',
                data: [],
                title: '刀柜物料统计',
                totalValue: [],
                sort: true,
                parameter: {
                    param: 'qua',
                    selectParam: 'spu'
                }

            },
            configData = {
                'selling': {
                    id: 'selling',
                    name: '售刀柜',
                    card: {
                        url: 'enterprisecab/bill/admin/inventoryReport/topCellBySell',
                        style: '1',
                        data: []
                    },
                    report: [
                        {
                            title: '总览',
                            id: 'sellingOverview',
                            reportMain: {
                                selling_materialRankingByLibrary: {
                                    id: 'selling_materialRankingByLibrary',
                                    title: '物料在库排名（按物料）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/querySellSkuRanking',
                                    data: [],
                                    size: 8,
                                    sort: true,
                                    style: 1,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'spu'
                                    },
                                },
                                selling_materialRankingByCabinet: {
                                    id: 'selling_materialRankingByCabinet',
                                    title: '物料在库排名（按柜子）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/querySellCabRanking',
                                    data: [],
                                    size: 8,
                                    sort: true,
                                    style: 2,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'main',
                                        tab: 'tab0'
                                    },
                                }
                            }
                        },
                        {
                            title: '按物料',
                            id: 'sellingMaterial',
                            reportMain: {
                                selling_materialRankingBySPU: {
                                    id: 'selling_materialRankingBySPU',
                                    title: '物料在库排名（按系列SPU）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/querySellSkuRanking',
                                    data: [],
                                    size: 10,
                                    sort: true,
                                    style: 1,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'spu',
                                        tab: "tab1"
                                    },
                                },
                                selling_materialRankingBySKU: {
                                    id: 'selling_materialRankingBySKU',
                                    title: '物料在库排名（按SKU）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/querySellSkuRanking',
                                    data: [],
                                    size: 30,
                                    sort: true,
                                    style: 3,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'sku',
                                        tab: "tab1"
                                    },
                                },
                                selling_materialRankingByType: {
                                    id: 'selling_materialRankingByType',
                                    title: '物料在库排名（按类型）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/querySellSkuRanking',
                                    data: [],
                                    size: 10,
                                    style: 1,
                                    sort: true,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'type',
                                        tab: "tab1"
                                    },
                                },
                                selling_materialRankingByClassification: {
                                    id: 'selling_materialRankingByClassification',
                                    title: '物料在库排名（按分类）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/querySellSkuRanking',
                                    data: [],
                                    size: 10,
                                    sort: true,
                                    style: 1,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'category',
                                        tab: "tab1"
                                    },
                                },
                                selling_materialRankingByBrand: {
                                    id: 'selling_materialRankingByBrand',
                                    title: '物料在库排名（品牌）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/querySellSkuRanking',
                                    data: [],
                                    size: 10,
                                    sort: true,
                                    style: 1,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'brand',
                                        tab: "tab1"
                                    },
                                }
                            }
                        },
                        {
                            title: '按柜子',
                            id: 'sellingCabinet',
                            reportMain: {
                                selling_materialRankingByMainCabinet: {
                                    id: 'selling_materialRankingByMainCabinet',
                                    title: '物料在库排名（按主柜）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/querySellCabRanking',
                                    data: [],
                                    size: 8,
                                    sort: true,
                                    style: 2,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'main',
                                        tab: 'tab1'
                                    },
                                },
                                selling_materialRankingByAuxiliaryCabinet: {
                                    id: 'selling_materialRankingByAuxiliaryCabinet',
                                    title: '物料在库排名（按副柜）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/querySellCabRanking',
                                    data: [],
                                    size: 8,
                                    sort: true,
                                    style: 2,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'desk',
                                        tab: 'tab1'
                                    },
                                },
                                selling_materialRankingByCargoLanes: {
                                    id: 'selling_materialRankingByCargoLanes',
                                    title: '物料在库统计（按货道）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/querySellCabRanking',
                                    data: [],
                                    size: 20,
                                    sort: true,
                                    style: 5,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'space',
                                        tab: 'tab1'
                                    },
                                },
                            }
                        }
                    ]
                },
                'storage': {
                    id: 'storage',
                    name: '存刀柜',
                    card: {
                        url: 'enterprisecab/bill/admin/inventoryReport/topCellByStore',
                        style: '2',
                        data: []
                    },
                    report: [
                        {
                            title: '总览',
                            id: 'storageOverview',
                            reportMain: {
                                storage_materialRankingByLibrary: {
                                    id: 'storage_materialRankingByLibrary',
                                    title: '物料在库排名（按物料）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/queryStoreSkuRanking',
                                    data: [],
                                    size: 8,
                                    sort: true,
                                    style: 1,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'spu',
                                        tab: 'tab0'
                                    },
                                },
                                storage_materialRankingByCabinet: {
                                    id: 'storage_materialRankingByCabinet',
                                    title: '物料在库排名（按柜子）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/queryStoreCabRanking',
                                    data: [],
                                    size: 8,
                                    sort: true,
                                    style: 2,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'main',
                                        tab: 'tab0'
                                    },
                                },
                                storage_materialRankingByDepositor: {
                                    id: 'storage_materialRankingByDepositor',
                                    title: '物料在库排名（按存入人）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/queryStoreCreatorRanking',
                                    data: [],
                                    size: 10,
                                    style: 4,
                                    sort: true,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        // tab:'tab0'
                                    },
                                }
                            }
                        },
                        {
                            title: '按物料',
                            id: 'storageMaterial',
                            reportMain: {
                                storage_materialRankingBySPU: {
                                    id: 'storage_materialRankingBySPU',
                                    title: '物料在库排名（按系列SPU）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/queryStoreSkuRanking',
                                    data: [],
                                    size: 10,
                                    sort: true,
                                    style: 1,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'spu',
                                        tab: 'type'
                                    },
                                },
                                storage_materialRankingBySKU: {
                                    id: 'storage_materialRankingBySKU',
                                    title: '物料在库排名（按SKU）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/queryStoreSkuRanking',
                                    data: [],
                                    size: 20,
                                    sort: true,
                                    style: 3,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'sku',
                                        tab: 'type'
                                    },
                                },
                                storage_materialRankingByType: {
                                    id: 'storage_materialRankingByType',
                                    title: '物料在库排名（按类型）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/queryStoreSkuRanking',
                                    data: [],
                                    size: 8,
                                    style: 2,
                                    sort: true,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'brand',
                                        tab: 'type'
                                    },
                                },
                                storage_materialRankingByClassification: {
                                    id: 'storage_materialRankingByClassification',
                                    title: '物料在库排名（按分类）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/queryStoreSkuRanking',
                                    data: [],
                                    size: 8,
                                    style: 2,
                                    sort: true,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'brand',
                                        tab: 'category'
                                    },
                                },
                                storage_materialRankingByBrand: {
                                    id: 'storage_materialRankingByBrand',
                                    title: '物料在库排名（按品牌）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/queryStoreSkuRanking',
                                    data: [],
                                    size: 8,
                                    sort: true,
                                    style: 2,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'brand',
                                        tab: 'tab1'
                                    },
                                }
                            }
                        },
                        {
                            title: '按柜子',
                            id: 'storageCabinet',
                            reportMain: {
                                storage_materialRankingByMainCabinet: {
                                    id: 'storage_materialRankingByMainCabinet',
                                    title: '物料在库排名（按主柜）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/queryStoreCabRanking',
                                    data: [],
                                    size: 8,
                                    sort: true,
                                    style: 2,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'main',
                                        tab: 'tab1'
                                    },
                                },
                                storage_materialRankingByAuxiliaryCabinet: {
                                    id: 'storage_materialRankingByAuxiliaryCabinet',
                                    title: '物料在库排名（按副柜）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/queryStoreCabRanking',
                                    data: [],
                                    size: 8,
                                    sort: true,
                                    style: 2,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'desk',
                                        tab: 'tab1'
                                    },
                                },
                                storage_materialRankingByCargoLanes: {
                                    id: 'storage_materialRankingByCargoLanes',
                                    title: '物料在库排名（按库位）',
                                    url: 'enterprisecab/bill/admin/inventoryReport/queryStoreCabRanking',
                                    data: [],
                                    size: 20,
                                    style: 5,
                                    sort: true,
                                    parameter: { // 请求参数
                                        param: 'qua',
                                        selectParam: 'space',
                                        tab: 'tab1'
                                    },
                                }
                            }
                        }
                    ]
                },
            },
            activeConfigData = configData['selling'], // （售刀柜、存刀柜）数据切换
            activeSubConfigData = activeConfigData.report[0], //(总览、按物料、按柜子)报表数据切换
            headerTime = {
                endTime: '', //结束时间
                mainCabCode: ''
            },
            colorList = ['#009C5E', '#2CBB79', '#AAD976', '#FBC235', '#FAD865'];

        init();

        function init() {
            headerTime.endTime = getCurrentDateTime();
            //渲染导航栏
            showNav(activeConfigData.report);
            //请求头部报表数据
            getReportTopData(reportTop);

            // 请求物料数据统计卡片数据
            getReportCard(activeConfigData.card);

            // 请求报表数据
            getAllReportData(activeSubConfigData.reportMain);
        }

        //tab切换
        $('#reportTabBox>.report-tab-list').click(function () {
            $(this).addClass('active').siblings().removeClass('active');
            activeConfigData = configData[$(this).attr('name')];

            showNav(activeConfigData.report);
            getReportCard(activeConfigData.card);
            activeSubConfigData = activeConfigData.report[0];
            $('#reportBody>.report-bodyList[data-name="' + $(this).attr('name') + '"]').show(300, function () {
                getAllReportData(activeSubConfigData.reportMain);
            }).siblings().hide(300);

            $('#reportBody>.report-bodyList[data-name="' + $(this).attr('name') + '"] .report-body-list').eq(0).show(300).siblings().hide(300);
            if ($('#inventoryReportMainBox').scrollTop() > 445) {
                $('#inventoryReportMainBox').animate({scrollTop: '445px'});
            }

        });

        //渲染导航栏
        function showNav(_data) {
            let html = '';
            // 初始化导航栏Bar
            _data.forEach((item, index) => {
                if (index === 0) {
                    html += '<div class="report-nav-item active" name="' + item.id + '">' + item.title + '</div>'
                } else {
                    html += '<div class="report-nav-item" name="' + item.id + '">' + item.title + '</div>'
                }
            });
            $('#reportNav').html(html);
            $('#reportNavBar').css({
                left: $('#reportNav>div').eq(0).position().left + ($('#reportNav>div').eq(0).outerWidth(true) / 2) + 'px',
                width: ($('#reportNav>div').eq(0).outerWidth(true) - 40) + 'px'
            });
        }


        // 导航栏切换
        $('#reportNav').delegate('div', 'click', function () {

            headerTime.endTime = getCurrentDateTime();

            activeSubConfigData = activeConfigData.report[$(this).index()];

            let thatElem = $('#reportBody>.report-bodyList[data-name=' + activeConfigData.id + '] .report-body-list').eq($(this).index());
            thatElem.show(300, function () {
                getAllReportData(activeSubConfigData.reportMain);
            }).siblings().hide(300);

            // 更改导航栏样式
            $(this).addClass('active').siblings().removeClass('active');

            //更改导航栏Bar位置
            $('#reportNavBar').css({
                left: $(this).position().left + ($(this).outerWidth(true) / 2) + 'px',
                width: ($(this).outerWidth(true) - 40) + 'px'
            });

            if ($('#inventoryReportMainBox').scrollTop() > 445) {
                $('#inventoryReportMainBox').animate({scrollTop: '445px'});
            }


        });


        // 滚动条
        $('#inventoryReportMainBox').scroll(function (e) {
            let reportWidth = $('#report').parent().width() - 10 + "px";
            $('#timeSelect').css({position: 'fixed', top: '101px', width: reportWidth});
            $('#reportTop').css({marginTop: '58px'});

            if ($(this).scrollTop() > 440) {
                $('#reportTab').css({position: 'fixed', top: '159px', width: reportWidth});
                $('#reportNavBox').css({position: 'fixed', top: '230px', width: reportWidth});
                $('#report').css({marginTop: '155px'});
            } else {
                $('#reportTab').css({position: 'relative', top: '0'});
                $('#reportNavBox').css({position: 'relative', top: '0'});
                $('#report').css({marginTop: '0'});
            }
        });

        form.render('select');

        //请求主柜下拉数据
        admin.req('enterprisecab/cabinet/admin/cabinet/getCabinetByCabinetNature?limit=9999', {}, res => {
            if (res.code === 200) {
                loadReportSelectHtml(res.data, "所有主柜", 'mainCabCode', 2, '#mainCabCodeBox')
            } else {
                loadReportSelectHtml([], "所有主柜", 'mainCabCode', 2, '#mainCabCodeBox')
            }
        }, 'get');

        //主柜下拉选项
        form.on('select(mainCabCode)', function (data) {
            headerTime.mainCabCode = data.value;
            getReportTopData(reportTop);
            getReportCard(activeConfigData.card);
            getAllReportData(activeSubConfigData.reportMain);
        });


        //初始化时间选择
        let day = laydate.render({
            elem: '#day',
            type: 'datetime',
            eventElem: '#dayIcon',
            value: getCurrentDateTime(),
            trigger: 'click',
            btns: ['now', 'confirm'],
            max: getCurrentDateTime(),
            done: function (value, date, endDate) {
                headerTime.endTime = value;
                //请求头部报表数据
                getReportTopData(reportTop);
                //头部卡片数据
                getReportCard(activeConfigData.card);
                //所有报表数据
                getAllReportData(activeSubConfigData.reportMain);
            }
        });


        //头部报表
        // 请求头部报表数据
        function getReportTopData(_data) {
            admin.req(_data.url, Object.assign({}, headerTime, _data.parameter), res => {
                if (res.code === 200) {
                    reportTop.data = res.data.data;
                    reportTop.title = res.data.title;
                    reportTop.totalValue = res.data.totalValue;
                }
                showReportTop(reportTop)
            })
        }

        //头部报表切换
        $('#inventoryReportDay .report-item-headerSwitch>div').click(function () {
            $(this).index() === 0 ? reportTop.parameter.param = 'qua' : reportTop.parameter.param = 'money';
            $(this).addClass('active').siblings().removeClass('active');
            getReportTopData(reportTop)
        });

        // 渲染头部报表
        function showReportTop(_obj) {
            $('#' + _obj.id).find('.report-item-headerTitle').text(_obj.title);

            if (_obj.totalValue.length > 0) {
                $('#' + _obj.id).find('.reportItemTips1 span').text(_obj.totalValue[0].totalNum || '0');
                $('#' + _obj.id).find('.reportItemTips2 span').text(_obj.totalValue[0].totalAmount || '0.00');
            }

            let _elem = document.getElementById(_obj.id).querySelector('.report-itemEcharts');
            $(_elem).attr('_echarts_instance_', '');
            const chartDom = _elem;
            const myChart = echarts.init(chartDom);
            let seriesData = [], option, xAxisData = [];
            let data = _obj.data;

            data.forEach(item => {
                seriesData.push(item);
                xAxisData.push(item.name)
            });

            option = {
                color: ['#2CBB79'],
                tooltip: {
                    trigger: "axis",
                    padding: 0,
                    backgroundColor: 'rgba(255,255,255,.7)',
                    formatter: function (parms) {
                        let str = "<div style='border-radius:5px;background-color: #fff;box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);padding: 15px;min-width: 120px;'>" +
                            "<div style='font-size: 16px;color: #333'>" + parms[0].marker + parms[0].data.name + "</div>" +
                            "<div style='display: flex;justify-content: space-between;'><div style='color:" + parms[0].color + ";margin-right: 10px'>值：</div><div style='color:#333;'>" + parms[0].data.value + "</div></div>" +
                            "<div style='display: flex;justify-content: space-between;'><div style='color:" + parms[0].color + ";margin-right: 10px'>占比：</div><div style='color:#333;'>" + isNullObj(parms[0].data.ratio) + "</div></div></div>";
                        return str;
                    }
                },
                grid: {
                    left: '10',
                    right: '10',
                    bottom: '30',
                    top: '20',
                    containLabel: true
                },
                xAxis: {
                    type: 'category',
                    data: xAxisData,
                    axisLabel: {
                        color: '#333333',
                        // rotate: -20,  //旋转
                        textStyle: {
                            fontSize: 12
                        },
                        formatter: (v) => {
                            if (v.length > 8) {
                                v = v.substring(0, 8);
                            }
                            return v;
                        }
                    },
                    axisLine: {
                        lineStyle: {
                            type: 'dashed',
                            color: 'rgba(107,107,107,0.37)',
                        }
                    },
                    axisTick: {
                        show: false
                    },
                },
                yAxis: {
                    type: 'value',
                    axisLabel: {
                        color: '#333333',
                        textStyle: {
                            fontSize: 12
                        },
                    },
                    axisLine: {
                        lineStyle: {
                            type: 'dashed',
                            color: 'rgba(107,107,107,0.37)',
                        }
                    },
                    axisTick: {
                        show: false
                    },
                    splitLine: {
                        lineStyle: {
                            type: 'dashed',
                        }
                    }
                },
                series: [
                    {
                        data: seriesData,
                        type: 'bar',
                        barWidth: '20px',
                        label: {
                            normal: {
                                show: true,
                                fontSize: 12,
                                fontWeight: '400',
                                color: '#333',
                                position: 'top',
                            }
                        },
                        itemStyle: {
                            // normal: {
                            //     barBorderRadius: barBorderRadius[_obj.id] || [0, 0, 0, 0],
                            // }
                        }
                    }
                ],
                dataZoom: [{
                    show: true,
                    height: 25,
                    xAxisIndex: [0],
                    bottom: 0,
                    // start: 100 - (15 / data.length) * 100,
                    // end: 100,
                    start: 0,
                    end: (15 / data.length) * 100,
                    handleSize: '110%',
                    handleStyle: {color: "#009C5E"},
                    textStyle: {color: "#000"},
                    fillerColor: "rgb(0,181,89,0.3)",
                    borderColor: "rgb(0,181,89,0.3)",

                }],
            };
            option && myChart.setOption(option, true);
        }


        //请求物料数据统计卡片数据
        function getReportCard(_data, _click) {
            let click = _click || 0;
            admin.req(_data.url, Object.assign({}, headerTime, {click}), res => {
                if (res.code === 200) {
                    activeConfigData.card.data = res.data;
                }
                showReportCard(activeConfigData.card);
            });
        }

        // 渲染物料数据统计卡片数据
        function showReportCard(_data) {
            if (_data.style === '1') {
                $('#overviewCard .report-card').last().hide(300)
            } else if (_data.style === '2') {
                $('#overviewCard .report-card').last().show(300)
            }
            if (_data.data && _data.data.length > 0) {
                _data.data.forEach((item, index) => {
                    $('#overviewCard .statBoxItemList').eq(index).find('.statBoxItemListName').text(item.title);
                    $('#overviewCard .statBoxItemList').eq(index).find('.statBoxItemListNum').text(item.value);
                    $('#overviewCard .statBoxItemList').eq(index).attr('sign', item.sign);
                    if (item.value1) {
                        $('#overviewCard .statBoxItemList').eq(index).find('.statBoxItemListName1').text(item.title2);
                        $('#overviewCard .statBoxItemList').eq(index).find('.statBoxItemListNum1').text(item.value1);
                    }
                    if (item.value2) {
                        $('#overviewCard .statBoxItemList').eq(index).find('.statBoxItemListName2').text(item.title3);
                        $('#overviewCard .statBoxItemList').eq(index).find('.statBoxItemListNum2').text(item.value2);
                    }
                })
            }
        }

        // 头部卡片点击事件
        $('#overviewCard').delegate('.statBoxItemList', 'click', function () {
            let that = $(this);
            admin.open({
                type: 1,
                area: ['1280px', '750px'],
                offset: '65px',
                title: that.find('.statBoxItemListName').text(),
                content: $('#cardTemplate').html(),
                success: function () {
                    let materialDataData = [];
                    const colsDataObj = {
                        selling: [
                            [
                                {type: 'numbers', 'title': '序号'}
                                , {field: 'skuCode', sort: true, title: '物料编号'}
                                , {field: 'skuName', sort: true, title: '物料名称'}
                                , {field: 'quantity', sort: true, title: '数量'}
                            ],
                            [
                                {type: 'numbers', 'title': '序号'}
                                , {field: 'skuCode', sort: true, title: '物料编号'}
                                , {field: 'skuName', sort: true, title: '物料名称'}
                                , {field: 'quantity', sort: true, title: '数量'}
                                , {field: 'marketPrice', sort: true, title: '市场价'}
                                , {field: 'amount', sort: true, title: '金额'}
                            ],
                            [
                                {type: 'numbers', 'title': '序号'}
                                , {field: 'skuCode', sort: true, title: '物料编号'}
                                , {field: 'belongCabinet', sort: true, title: '主柜编号'}
                                , {field: 'cabCode', sort: true, title: '柜子编号'}
                                , {field: 'cabName', sort: true, title: '柜子名称'}
                                // , {field: 'cabinetNature', sort: true, title: '柜子性质'}
                                , {field: 'quantity', sort: true, title: '数量'}
                                // , {field: 'quantityPack', sort: true, title: '包装数量'}
                                , {field: 'quantitySetting', sort: true, title: '告警设置数'}
                                , {field: 'spaceCode', sort: true, title: '货道编号'}
                            ]
                        ],
                        storage: [
                            [
                                {type: 'numbers', 'title': '序号'}
                                , {field: 'skuCode', sort: true, title: '物料编号'}
                                , {field: 'skuName', sort: true, title: '物料名称'}
                                , {field: 'quantity', sort: true, title: '数量'}
                            ],
                            [
                                {type: 'numbers', 'title': '序号'}
                                , {field: 'skuCode', sort: true, title: '物料编号'}
                                , {field: 'skuName', sort: true, title: '物料名称'}
                                , {field: 'quantity', sort: true, title: '数量'}
                                , {field: 'marketPrice', sort: true, title: '市场价'}
                                , {field: 'amount', sort: true, title: '金额'}
                            ],
                            [
                                {type: 'numbers', 'title': '序号'}
                                , {field: 'skuCode', sort: true, title: '物料编号'}
                                , {field: 'belongCabinet', sort: true, title: '主柜编号'}
                                , {field: 'cabCode', sort: true, title: '柜子编号'}
                                , {field: 'cabName', sort: true, title: '柜子名称'}
                                // , {field: 'cabinetNature', sort: true, title: '柜子性质'}
                                , {field: 'quantity', sort: true, title: '数量'}
                                // , {field: 'quantityPack', sort: true, title: '包装数量'}
                                , {field: 'quantitySetting', sort: true, title: '告警设置数'}
                                , {field: 'spaceCode', sort: true, title: '货道编号'}
                            ],
                            [
                                {type: 'numbers', 'title': '序号'}
                                , {field: 'cabCode', sort: true, title: '柜子编号'}
                                , {field: 'spaceCode', sort: true, title: '货道'}
                                , {field: 'tempNum', sort: true, title: '暂存数'}
                                , {field: 'commonNum', sort: true, title: '公共数'}
                                , {field: 'personalNum', sort: true, title: '专人数'}
                            ],
                            [
                                {type: 'numbers', 'title': '序号'}
                                , {field: 'cabCode', sort: true, title: '柜子编号'}
                                , {field: 'quantity', sort: true, title: '数量'}
                                , {field: 'statusDesc', sort: true, title: '状态'}
                                , {field: 'businessTypeDesc', sort: true, title: '操作类型'}
                            ],
                            [
                                {type: 'numbers', 'title': '序号'}
                                , {field: 'cabCode', sort: true, title: '柜子编号'}
                                , {field: 'quantity', sort: true, title: '数量'}
                                , {field: 'statusDesc', sort: true, title: '状态'}
                                , {field: 'businessTypeDesc', sort: true, title: '操作类型'}
                            ]
                        ]
                    };

                    admin.reqSync(activeConfigData.card.url, Object.assign({}, headerTime, {click: $('#overviewCard .statBoxItemList').index(that) + 1}), res => {
                        if (res.code === 200) {
                            materialDataData = res.data;
                        }
                    });

                    let materialDataTb = table.render({
                        elem: '#cardTemplateTable',
                        data: materialDataData,
                        cellMinWidth: 100,
                        page: true,
                        cols: [colsDataObj[activeConfigData.id][that.attr('sign') - 1]],
                        done: function (res, curr, count) {
                            if (count === 0) {
                                $('#cardTemplateExport').hide();
                            } else {
                                $('#cardTemplateExport').show();
                                $('#cardTemplateExport').click(function () {
                                    table.exportFile(materialDataTb.config.id, materialDataData, 'xls', that.find('.statBoxItemListName').text())
                                })
                            }
                        }
                    });

                }
            });
        });


        // 头部报表下拉框选择
        form.on('select(selectParamTop)', function (data) {
            reportTop.parameter.selectParam = data.value;
            getReportTopData(reportTop);
        });
        // 所有报表下拉框选择
        form.on('select', function (data) {
            if ($(data.elem).parents('#reportBody').attr('id') === 'reportBody') {
                let obj = {};
                activeSubConfigData.reportMain[$(data.elem).parents('.report-main-item').attr('id')].parameter[$(data.elem).attr('name')] = data.value;
                obj[$(data.elem).parents('.report-main-item').attr('id')] = activeSubConfigData.reportMain[$(data.elem).parents('.report-main-item').attr('id')];
                getAllReportData(obj);

            } else {
                return false;
            }

        });

        //数量金额切换
        $('#reportBody .report-item-headerSwitch>div').click(function () {

            if (!$(this).hasClass('active')) {
                let obj = {};
                //qua 数量  money金额
                activeSubConfigData.reportMain[$(this).parents('.report-main-item').attr('id')].parameter.param = $(this).index() === 0 ? 'qua' : 'money';
                //
                obj[$(this).parents('.report-main-item').attr('id')] = activeSubConfigData.reportMain[$(this).parents('.report-main-item').attr('id')];

                getAllReportData(obj);

                $(this).addClass('active').siblings().removeClass('active');
            }
        });


        form.on('select', function (data) {
            if ($(data.elem).parents('#reportBody').attr('id') === 'reportBody') {
                let obj = {};
                activeSubConfigData.reportMain[$(data.elem).parents('.report-main-item').attr('id')].parameter[$(data.elem).attr('name')] = data.value;
                obj[$(data.elem).parents('.report-main-item').attr('id')] = activeSubConfigData.reportMain[$(data.elem).parents('.report-main-item').attr('id')];
                getAllReportData(obj);

            } else {
                return false
            }

        });


        // 所有报表点击更多事件
        $('#reportBody .report-item-more').click(function () {
            if (activeSubConfigData.reportMain[$(this).parents('.report-main-item').attr('id')].data.length === 0) {
                layer.msg('暂时没有数据~~~', {icon: 5});
                return false;
            }
            showAllDataChart(activeSubConfigData.reportMain[$(this).parents('.report-main-item').attr('id')])
        });

        // 所有报表点击更多事件
        $('#inventoryReportDay .report-item-more').click(function () {
            if (reportTop.data.length === 0) {
                layer.msg('暂时没有数据~~~', {icon: 5});
                return false;
            }
            showAllDataChart(reportTop)
        });


        //请求报表数据
        function getAllReportData(_data) {
            for (let _key in _data) {
                admin.req(activeSubConfigData.reportMain[_key].url, Object.assign({}, headerTime, activeSubConfigData.reportMain[_key].parameter), res => {
                    if (res.code === 200) {
                        activeSubConfigData.reportMain[_key].data = res.data.data;
                        activeSubConfigData.reportMain[_key].title = res.data.title;
                        if (res.data.totalSum) {
                            activeSubConfigData.reportMain[_key].totalSum = res.data.totalSum;
                        }
                        if (res.data.unit) {
                            activeSubConfigData.reportMain[_key].unit = res.data.unit;
                        }
                        if (res.data.totalSumOne) {
                            activeSubConfigData.reportMain[_key].totalSumOne = res.data.totalSumOne;
                        }
                    } else {
                        activeSubConfigData.reportMain[_key].data = [];
                    }
                    initReport(activeSubConfigData.reportMain[_key]);
                })
            }
        }

        // 初始化报表
        function initReport(_data) {
            $('#' + _data.id).find('.report-item-headerTitle').text(_data.title);
            switch (_data.style) {
                case 1:
                    showReportTemplate1(_data);
                    break;
                case 2:
                    showReportTemplate2(_data);
                    break;
                case 3:
                    showReportTemplate3(_data);
                    break;
                case 4:
                    showReportTemplate4(_data);
                    break;
                case 5:
                    showReportTemplate5(_data);
                    break;
                default:
            }
        }

        //报表模板1
        function showReportTemplate1(_obj) {
            let _elem = document.getElementById(_obj.id).querySelector('.report-itemEcharts');
            $(_elem).attr('_echarts_instance_', '');
            let colorArray = {},
                barBorderRadius = {
                    'storage_materialRankingByCargoLanes': [20, 20, 20, 20],
                };

            const myChart = echarts.init(_elem);

            let seriesData = [], xAxisData = [], option = {};
            let data = _obj.data.slice(0, _obj.size || 5);
            data.forEach((item, index) => {
                if (!item.name) {
                    item.name = '未知名称' + index;
                }

                xAxisData.push(item.name);
                seriesData.push(item)
            });

            option = {
                color: colorArray[_obj.id] || ['#2CBB79'],
                tooltip: {
                    trigger: "axis",
                    padding: 0,
                    backgroundColor: 'rgba(255,255,255,.7)',
                    formatter: function (parms) {
                        let str = "<div style='border-radius:5px;background-color: #fff;box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);padding: 15px;min-width: 120px;'>" +
                            "<div style='font-size: 16px;color: #333'>" + parms[0].marker + parms[0].data.name + "</div>" +
                            "<div style='display: flex;justify-content: space-between;'><div style='color:" + parms[0].color + ";margin-right: 10px'>值：</div><div style='color:#333;'>" + parms[0].data.value + "</div></div>" +
                            "<div style='display: flex;justify-content: space-between;'><div style='color:" + parms[0].color + ";margin-right: 10px'>占比：</div><div style='color:#333;'>" + isNullObj(parms[0].data.ratio) + "</div></div></div>";
                        return str;
                    }
                },
                grid: {
                    left: '10',
                    right: '10',
                    bottom: '10',
                    top: '20',
                    containLabel: true
                },
                xAxis: {
                    type: 'category',
                    data: xAxisData,
                    axisLabel: {
                        color: '#333333',
                        // rotate: -20,  //旋转
                        textStyle: {
                            fontSize: 12
                        },
                        formatter: (v) => {
                            if (v.length > 8) {
                                v = v.substring(0, 8);
                            }
                            return v;
                        }
                    },
                    axisLine: {
                        lineStyle: {
                            type: 'dashed',
                            color: 'rgba(107,107,107,0.37)',
                        }
                    },
                    axisTick: {
                        show: false
                    },
                },
                yAxis: {
                    type: 'value',
                    axisLabel: {
                        color: '#333333',
                        textStyle: {
                            fontSize: 12
                        },
                    },
                    axisLine: {
                        lineStyle: {
                            type: 'dashed',
                            color: 'rgba(107,107,107,0.37)',
                        }
                    },
                    axisTick: {
                        show: false
                    },
                    splitLine: {
                        lineStyle: {
                            type: 'dashed',
                        }
                    }
                },
                series: [
                    {
                        data: seriesData,
                        type: 'bar',
                        barWidth: '20px',
                        label: {
                            normal: {
                                show: true,
                                fontSize: 12,
                                fontWeight: '400',
                                color: '#333',
                                position: 'top',
                            }
                        },
                        itemStyle: {
                            normal: {
                                barBorderRadius: barBorderRadius[_obj.id] || [0, 0, 0, 0],
                            }
                        }
                    }
                ]
            };
            option && myChart.setOption(option, true);
        }

        //报表模板2
        function showReportTemplate2(_obj) {
            let _elem = document.getElementById(_obj.id).querySelector('.report-itemEcharts');
            $(_elem).attr('_echarts_instance_', '');
            const myChart = echarts.init(_elem);
            let seriesData = [], xAxisData = [], option = {};
            let data = _obj.data.slice(0, _obj.size || 5);

            if (_obj.data.unit) {
                $('#' + _obj.id + ' .reportItemUnit').text("（单位：" + _obj.data.unit + "）");
            } else {
                $('#' + _obj.id + ' .reportItemUnit').text("（单位：" + _obj.parameter.param == 'qua' ? '支' : '元' + "）");
            }

            data.forEach((item, index) => {
                if (!item.name) {
                    item.name = '未知名称' + index;
                }
                xAxisData.push(item.name);
                seriesData.push(item)
            });

            option = {
                color: colorList,
                legend: {
                    icon: `path://M881.387 297.813c38.08 65.387 57.28 136.747 57.28 214.187s-19.094 148.8-57.28 214.187c-38.187 65.28-89.92 117.12-155.2 155.2S589.44 938.667 512 938.667s-148.8-19.094-214.187-57.28c-65.28-38.08-117.013-89.814-155.306-155.307C104.427 660.8 85.333 589.44 85.333 512c0-77.333 19.094-148.693 57.28-214.187 38.08-65.28 89.814-117.013 155.307-155.306C363.2 104.533 434.56 85.333 512 85.333c77.333 0 148.693 19.094 214.187 57.28 65.28 38.187 117.013 89.92 155.2 155.2z m-217.707-47.36C617.387 223.467 566.827 209.92 512 209.92s-105.387 13.547-151.68 40.533-82.987 63.68-109.973 109.974c-26.987 46.293-40.534 96.853-40.534 151.68s13.547 105.386 40.534 151.68c26.986 46.293 63.68 82.986 109.973 109.973 46.293 26.987 96.853 40.533 151.68 40.533s105.387-13.546 151.68-40.533c46.293-26.987 82.987-63.68 109.973-109.973 26.987-46.294 40.534-96.854 40.534-151.68s-13.547-105.387-40.534-151.68c-27.093-46.294-63.786-82.987-109.973-109.974z`,
                    orient: 'vertical',
                    left: '55%',
                    top: 'center',
                    align: 'left',
                    itemWidth: 14,
                    itemHeight: 14,
                    itemStyle: {
                        borderRadius: '30',
                    },
                    textStyle: {
                        color: "#333"
                    },
                    itemGap: 10,
                    formatter: function (params) {
                        let value = "", ratio = "";
                        seriesData.forEach(item => {
                            if (item.name == params) {
                                value = item.value;
                                ratio = item.ratio;
                            }

                        });
                        return [`{name|${params}}\n{value|${value}} {ratio|${isNullObj(ratio)}}`];
                    },
                    textStyle: {
                        rich: {
                            name: {
                                fontSize: 16,
                                lineHeight: 20,
                                color: '#000',
                            },
                            value: {
                                fontSize: 14,
                                lineHeight: 16,
                                color: '#333',
                                fontWeight: '500',
                                width: 80,
                                overflow: 'hidden',
                            },
                            ratio: {
                                fontSize: 14,
                                lineHeight: 16,
                                color: '#009C5E',
                                fontWeight: '500'
                            },
                        }

                    },
                },
                tooltip: {
                    trigger: 'item',
                    show: true,
                    padding: 0,
                    backgroundColor: 'rgba(255,255,255,.7)',
                    formatter: function (parms) {
                        let str = "<div style='border-radius:5px;background-color: #fff;box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);padding: 15px;min-width: 120px;color: #000'>" +
                            "<div><span style='color: #2CBB79'>数值：</span><span>" + parms.data.value + "</span></div>" +
                            "<div><span style='color: #2CBB79'>占比：</span><span>" + isNullObj(parms.data.ratio) + "</span></div>" +
                            "<div><span style='color: #2CBB79'>名称：</span><span>" + parms.data.name + "</span></div></div>";
                        return str;
                    }
                },
                series: [
                    {
                        radius: ['30%', '60%'],
                        center: ['30%', '50%'],
                        type: 'pie',
                        label: {show: false},
                        data: seriesData,
                    },

                ]
            };
            option && myChart.setOption(option, true);
        }

        //报表模板3
        function showReportTemplate3(_obj) {
            let data = _obj.data.slice(0, _obj.size || 20);
            laytpl(listBox1.innerHTML).render(data, function (html) {
                document.getElementById(_obj.id).querySelector(".listBox1").innerHTML = html;
            })
        }

        //报表模板4
        function showReportTemplate4(_obj) {
            let _elem = document.getElementById(_obj.id).querySelector('.report-itemEcharts');
            $(_elem).attr('_echarts_instance_', '');
            const myChart = echarts.init(_elem);
            let seriesData = [], xAxisData = [], option = {}, seriesData1 = [], seriesData2 = [];
            let data = _obj.data.slice(0, _obj.size || 10);
            data.forEach((item, index) => {
                if (!item.name) {
                    item.name = '未知名称' + index;
                }
                xAxisData.push(item.name);
                seriesData.push(item);
                if (item.value1) {
                    seriesData1.push({value: item.value1, ratio: item.ratio1})
                }
                if (item.value2) {
                    seriesData2.push({value: item.value2, ratio: item.ratio2})
                }
            });


            option = {
                color: ['#F77234', '#FFB94D', '#2CBB79'],
                legend: {
                    top: '0',
                    data: ['暂存', '报修', '报废'],
                    itemGap: 30
                },
                tooltip: {
                    trigger: "axis",
                    padding: 0,
                    backgroundColor: 'rgba(255,255,255,.7)',
                    formatter: function (parms) {
                        let htmlStr = '', str = '';
                        parms.reverse().forEach((item, index) => {
                            htmlStr += `<div style='display: flex;font-size: 12px;color: #333;justify-content: space-between;'>
                                           <div>${item.marker}${item.seriesName}</div>
                                           <div style="margin: 0 20px">${item.value}</div>
                                           <div>${item.data.ratio}</div>
                                       </div>`
                        });
                        str = "<div style='border-radius:5px;background-color: #fff;box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);padding: 15px;min-width: 120px;'>" +
                            "<div style='font-size: 14px;font-weight: 400;color: #666'>" + parms[0].name + "</div>" + htmlStr + "</div>";
                        return str;
                    }
                },
                grid: {
                    left: '0',
                    right: '0',
                    bottom: '0',
                    top: '20',
                    containLabel: true
                },
                xAxis: {
                    type: 'category',
                    data: xAxisData,
                    axisLabel: {
                        color: '#333333',
                        // rotate: 10,  //旋转
                        textStyle: {
                            fontSize: 12
                        },
                        formatter: (v) => v.slice(0, 10)
                    },
                    axisLine: {
                        lineStyle: {
                            type: 'dashed',
                            color: 'rgba(107,107,107,0.37)',
                        }
                    },
                    axisTick: {
                        show: false
                    },
                },
                yAxis: {
                    type: 'value',
                    axisLabel: {
                        color: '#333333',
                        textStyle: {
                            fontSize: 12
                        },
                    },
                    axisLine: {
                        lineStyle: {
                            type: 'dashed',
                            color: 'rgba(107,107,107,0.37)',
                        }
                    },
                    axisTick: {
                        show: false
                    },
                    splitLine: {
                        lineStyle: {
                            type: 'dashed',
                        }
                    }
                },
                series: [
                    {
                        data: seriesData2,
                        name: '报废',
                        type: 'bar',
                        stack: '2',
                        barWidth: '20px',
                    },
                    {
                        data: seriesData1,
                        name: '报修',
                        type: 'bar',
                        stack: '2',
                        barWidth: '20px',
                    },
                    {
                        data: seriesData,
                        name: '暂存',
                        type: 'bar',
                        stack: '2',
                        barWidth: '20px',
                    },

                ]
            };
            option && myChart.setOption(option, true);
        }

        //报表模板5
        function showReportTemplate5(_obj) {
            let _elem = document.getElementById(_obj.id).querySelector('.report-itemEcharts');
            $(_elem).attr('_echarts_instance_', '');
            const myChart = echarts.init(_elem);
            let seriesData = [], xAxisData = [], option = {}, bgData = [];
            let data = _obj.data.slice(0, _obj.size || 5);
            data.forEach((item, index) => {
                if (!item.name) {
                    item.name = '未知名称' + index;
                }

                xAxisData.push(item.name);
                seriesData.push(item);
                bgData.push(1)
            });

            option = {
                color: ['#2CBB79'],
                tooltip: {
                    trigger: "axis",
                    padding: 0,
                    backgroundColor: 'rgba(255,255,255,.7)',
                    formatter: function (parms) {
                        let str = "<div style='border-radius:5px;background-color: #fff;box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);padding: 15px;min-width: 120px;'>" +
                            "<div style='font-size: 16px;color: #333'>" + parms[0].marker + parms[0].data.name + "</div>" +
                            "<div style='display: flex;justify-content: space-between;'><div style='color:" + parms[0].color + ";margin-right: 10px'>值：</div><div style='color:#333;'>" + parms[0].data.value + "</div></div>" +
                            "<div style='display: flex;justify-content: space-between;'><div style='color:" + parms[0].color + ";margin-right: 10px'>占比：</div><div style='color:#333;'>" + isNullObj(parms[0].data.ratio) + "</div></div></div>";
                        return str;
                    }
                },
                grid: {
                    left: '10',
                    right: '10',
                    bottom: '10',
                    top: '20',
                    containLabel: true
                },
                xAxis: [{
                    type: 'category',
                    data: xAxisData,
                    axisLabel: {
                        color: '#333333',
                        textStyle: {
                            fontSize: 12
                        },
                        formatter: (v) => {
                            if (v.length > 8) {
                                v = v.substring(0, 8);
                            }
                            return v;
                        }
                    },
                    axisLine: {
                        lineStyle: {
                            type: 'dashed',
                            color: 'rgba(107,107,107,0.37)',
                        }
                    },
                    axisTick: {
                        show: false
                    },
                }],
                yAxis: [
                    {
                        type: 'value',
                        axisLabel: {
                            color: '#333333',
                            textStyle: {
                                fontSize: 12
                            },
                        },
                        axisLine: {
                            lineStyle: {
                                type: 'dashed',
                                color: 'rgba(107,107,107,0.37)',
                            }
                        },
                        axisTick: {
                            show: false
                        },
                        splitLine: {
                            lineStyle: {
                                type: 'dashed',
                            }
                        }
                    },
                    {
                        type: 'value',
                        splitLine: {
                            show: false
                        },
                        axisLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLabel: {
                            show: false
                        },
                        splitArea: {
                            show: false,
                        }
                    }],
                series: [
                    {
                        data: seriesData,
                        type: 'bar',
                        barWidth: '20px',
                        label: {
                            normal: {
                                show: true,
                                fontSize: 12,
                                fontWeight: '400',
                                color: '#333',
                                position: 'top',
                            }
                        },
                        itemStyle: {
                            normal: {
                                barBorderRadius: 20,
                            }
                        },
                        zlevel: 11
                    },
                    {
                        name: '背景',
                        type: 'bar',
                        barWidth: '20px',
                        xAxisIndex: 0,
                        yAxisIndex: 1,
                        barGap: '-100%',
                        data: bgData,
                        itemStyle: {
                            normal: {
                                barBorderRadius: 20,
                                color: 'rgba(0,0,0,0.1)'
                            }
                        },
                        zlevel: 9
                    },
                ]
            };
            option && myChart.setOption(option, true);
        }

        // 更多弹窗
        function showAllDataChart(_data) {
            admin.open({
                type: 1,
                area: ['1400px', '700px'],
                offset: '65px',
                title: _data.title,
                content: $('#allDataChart').html(),
                success: function () {
                    const myChart = echarts.init(document.getElementById('allDataChartFormchartDom'));
                    let seriesData = [], seriesData1 = [], seriesData2 = [], yAxisData = [], option, dataZoomObj = '',
                        seriesObjData = [], tooltipObj = {}, colors = ['#01B780'];
                    let colsData = [{field: 'name', title: '名称'}];
                    let data = _data.sort ? [..._data.data].reverse() : [..._data.data];
                    data.forEach(item => {
                        yAxisData.push(item.name);
                        seriesData.push(item);
                        if (item.value1) {
                            seriesData1.push(item.value1)
                        }
                        if (item.value2) {
                            seriesData2.push(item.value2)
                        }
                    });
                    if (data[0].ratio) {
                        colsData.push({field: 'ratio', title: '占比'})
                    }

                    if (seriesData2.length > 0) {
                        colsData.push(
                            {field: 'value', title: '暂存'},
                            {field: 'value1', title: '报修'},
                            {field: 'value2', title: '报废'}
                        );
                        seriesObjData.push(
                            {name: '报废', type: 'bar', barWidth: '15', stack: '2', data: seriesData2},
                            {name: '报修', type: 'bar', barWidth: '15', stack: '2', data: seriesData1},
                            {name: '暂存', type: 'bar', barWidth: '15', stack: '2', data: seriesData},
                        );
                        tooltipObj = {
                            trigger: "axis",
                            padding: 0,
                            backgroundColor: 'rgba(255,255,255,.7)',
                            formatter: function (parms) {
                                let htmlStr = '', str = '';
                                parms.reverse().forEach(item => {
                                    htmlStr += `<div style='display: flex;font-size: 12px;color: #333;justify-content: space-between;'>
                                           <div style="margin-right: 30px">${item.marker}${item.seriesName}</div>
                                           <div>${item.value}</div>
                                       </div>`
                                });
                                str = "<div style='border-radius:5px;background-color: #fff;box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);padding: 15px;min-width: 120px;'>" +
                                    "<div style='font-size: 14px;font-weight: 400;color: #666'>" + parms[0].name + "</div>" + htmlStr + "</div>";
                                return str;
                            }
                        };
                        colors = ['#FFB94D', '#F77234', '#2CBB79'];
                    } else if (seriesData1.length > 0) {
                        colsData.push({field: 'value', title: '数量(包装计)'}, {field: 'value1', title: '数量(基础单位计)'});
                        seriesObjData.push(
                            {name: '数量(包装计)', type: 'bar', barWidth: '15', stack: '2', data: seriesData},
                            {name: '数量(基础单位计)', type: 'bar', barWidth: '15', stack: '2', data: seriesData1}
                        );
                        tooltipObj = {
                            trigger: "axis",
                            padding: 0,
                            backgroundColor: 'rgba(255,255,255,.7)',
                            formatter: function (parms) {
                                let htmlStr = '', str = '';
                                parms.forEach(item => {
                                    htmlStr += `<div style='display: flex;font-size: 12px;color: #333;justify-content: space-between;'>
                                           <div style="margin-right: 30px">${item.marker}${item.seriesName}</div>
                                           <div>${item.value}</div>
                                       </div>`
                                });
                                str = "<div style='border-radius:5px;background-color: #fff;box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);padding: 15px;min-width: 120px;'>" +
                                    "<div style='font-size: 14px;font-weight: 400;color: #666'>" + parms[0].name + "</div>" + htmlStr + "</div>";
                                return str;
                            }
                        };
                        colors = ['#2CBB79', '#FFB94D'];
                    } else {
                        colsData.push({field: 'value', title: '数值'});
                        seriesObjData.push(
                            {name: _data.data.title, type: 'bar', barWidth: '15', data: seriesData}
                        );
                        tooltipObj = {
                            trigger: "axis",
                            padding: 0,
                            backgroundColor: 'rgba(255,255,255,.7)',
                            formatter: function (parms) {
                                let str = '', code = '';
                                if (parms[0].data.oldSpecCode) {
                                    code = "<div>规格：" + parms[0].data.oldSpecCode + "</div>"
                                } else {
                                    code = ""
                                }

                                str = "<div style='border-radius:5px;background-color: #fff;box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);padding: 15px;min-width: 120px;color: #2CBB79'>" +
                                    "<div>数值：" + parms[0].data.value + "</div>" +
                                    "<div>占比：" + isNullObj(parms[0].data.ratio) + "</div>" + code +
                                    "<div>名称：" + parms[0].data.name + "</div></div>";
                                return str;
                            }
                        };
                        colors = ['#01B780'];
                    }

                    if (data[0].oldSpecCode) {
                        colsData.push({field: 'oldSpecCode', title: '物料规格'})
                    }


                    if (seriesData.length > 10) {
                        dataZoomObj = {
                            type: 'slider',
                            startValue: 1,
                            endValue: 10,
                            show: true,
                            right: 0,
                            width: 20,
                            start: 100 - (10 / seriesData.length) * 100,
                            end: 100,
                            yAxisIndex: 0,
                            handleStyle: {color: "#009C5E"},
                            textStyle: {color: "#000"},
                            fillerColor: "rgb(0,181,89,0.3)",
                            borderColor: "rgb(0,181,89,0.3)",
                        }
                    } else {
                        dataZoomObj = ''
                    }

                    option = {
                        color: colors,
                        tooltip: tooltipObj,
                        grid: {
                            left: '30',
                            right: '2%',
                            bottom: '0%',
                            containLabel: true
                        },
                        xAxis: {
                            type: 'value',
                            axisLabel: {
                                color: '#333333',
                                textStyle: {
                                    fontSize: 12
                                },
                            },
                            axisLine: {
                                lineStyle: {
                                    type: 'dashed',
                                    color: 'rgba(107,107,107,0.37)',
                                }
                            },
                            axisTick: {
                                show: false
                            },
                        },
                        yAxis: {
                            type: 'category',
                            data: yAxisData,
                            axisLabel: {
                                color: '#333333',
                                textStyle: {
                                    fontSize: 12
                                },
                                formatter: (v) => {
                                    if (v.length > 10) {
                                        v = v.substring(0, 10) + '...';
                                    }
                                    return v;
                                }
                            },
                            axisLine: {
                                lineStyle: {
                                    type: 'dashed',
                                    color: 'rgba(107,107,107,0.37)',
                                }
                            },
                            axisTick: {
                                show: false
                            },
                        },
                        dataZoom: dataZoomObj,
                        series: seriesObjData
                    };

                    option && myChart.setOption(option, true);


                    let allDataChartTb = table.render({
                        elem: '#allDataChartTable',
                        data: data,
                        cellMinWidth: 100,
                        page: false,
                        cols: [colsData],
                    });

                    if (data.length === 0) {
                        $('#allDataChartFormExport').remove();
                    } else {
                        $('#allDataChartFormExport').click(function () {
                            table.exportFile(allDataChartTb.config.id, [...data].reverse(), 'xls', _data.name)
                        })
                    }

                }
            });

        }

        // 渲染下拉框
        function loadReportSelectHtml(data, tips, htmltarget, type, parentName) {
            let html = ' <option value="">' + tips + '</option>';
            if (!data || data == null) {
                return;
            }
            for (let i = 0; i < data.length; i++) {
                if (type == 1) {
                    html += `<option value='${data[i].name}'>${data[i].name}</option>`;
                } else if (type == 2) {
                    html += `<option value='${data[i].cabCode}'>${data[i].cabCode}</option>`;
                }
            }
            $(parentName).find("select[name='" + htmltarget + "']").html(html);
            form.render('select');
        }

        // 图片点击放大
        $("body").delegate(".checkImg", "click", function () {
            admin.previewImg(this)
        });

        // 判断是否是 空{}
        function isNullObj(_data) {
            if (_data) {
                if (JSON.stringify(_data) == "{}") {
                    return '0%'
                } else {
                    return _data
                }
            }
            return '0%';
        }

        //单位转换
        function priceUnit(num) {
            let unit = ['', '万', '亿', '万亿'];
            let k = 10000, i;
            if (num < k) {
                return num
            } else {
                i = Math.floor(Math.log(num) / Math.log(k));
                return (num / Math.pow(k, i)).toFixed(2) + unit[i]
            }
        }

        //长度限制
        function limitLength(str, length) {
            // 如果字符串的长度小于等于限制的长度，则直接返回原字符串
            if (str.length <= length) {
                return str;
            }
            // 否则，只取前面限制长度的部分字符串，并在结尾加上省略号
            return str.slice(0, length) + '...';
        }

        // 获取月份的天数
        function getMonthDays(year, month) {
            let targetDate = new Date(year, month, 0); // 目标月份的最后一天
            let totalDays = targetDate.getDate(); // 获取目标月份的天数
            return totalDays;
        }

        function getCurrentDateTime() {
            let currentDate = new Date();

            let year = currentDate.getFullYear();
            let month = addLeadingZero(currentDate.getMonth() + 1);
            let day = addLeadingZero(currentDate.getDate());
            let hours = addLeadingZero(currentDate.getHours());
            let minutes = addLeadingZero(currentDate.getMinutes());
            let seconds = addLeadingZero(currentDate.getSeconds());

            return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds;
        }

        function addLeadingZero(value) {
            return value < 10 ? '0' + value : value;
        }
    });
</script>
